var SelectDeletable = function(e) {

	var element = JSD.$(e);
	
	
	this.options = [];
	var $this = this;
	
	this.addOption = function(text, value) {
		
		var opt = new Option();
		opt.text = text;
		opt.value = value;
		
		
		var row = document.createElement("div");
		row.className = "item deletable";
		
		var elemValue = document.createElement("input");
		elemValue.type = "hidden";
		elemValue.value = value;
		
		var elemText = document.createElement("div");
		elemText.className = "text";
		elemText.innerHTML = text;
		
		var elemDelete = document.createElement("button");
		elemDelete.className = "img-delete";
		
		row.appendChild(elemValue);
		row.appendChild(elemText);
		row.appendChild(elemDelete);
		
		JSD.on("click",elemDelete,_onClickDelete);
		
		opt.relatedDOM = row;
		elemDelete.relatedOption = opt;
		
		$this.options.push(opt);
		JSD.$(element).appendChild(row);
		
		var event = new CustomEvent("add", {
			option: opt,
			cancelable: true,
			bubbles: true
		});
		
		element.dispatchEvent(event);
	};
	
	function _onClickDelete(e) {
		var value = this.relatedOption.value;
		$this.deleteOption(value);
	};
	
	this.deleteOption = function(value) {
		var indexOption = -1;
		var opt = null;
		for (var i = 0; i < $this.options.length; i++) {
			if ($this.options[i].value == value) {
				opt = $this.options[i];
				var indexOption = i;
				break;
			}
		}
		if (indexOption != -1) {
			$this.options.splice(indexOption, 1);
		}
		opt.relatedDOM.parentNode.removeChild(opt.relatedDOM);
	}
	
	this.init = function() {
		var items = element._JSD_getElemsByCSSRule(".item");

		for (var i = 0; i < items.length; i++) {
			var item = items[i];
			var val = item.getElementsByTagName("input")[0].value;
			var text = item.getElementsByTagName("div")[0].innerHTML;
			
			var opt = new Option();
			opt.value = val;
			opt.text = text;
			
			
			var imgdelete = item.getElementsByTagName("button")[0];
			imgdelete.relatedOption = opt;
			JSD.on("click",imgdelete,_onClickDelete);
			
			opt.relatedDOM = item;
			
			$this.options.push(opt);
		}
	};
	
	this.init();
};